import React, { Component } from 'react';
import { StyleSheet, SafeAreaView, ScrollView, View, Text } from 'react-native';
import api from '@/api';
import { msg, _, BackImageOn, XMHeader } from '@/common';
import XmWebview from 'react-native-autoheight-webview';
import { screenWidth, px2dp } from '../common/styles';
/*
 * @Author: kanglang
 * @Date: 2020/6/28
 * @LastEditors: 汪滔
 * @LastEditTime: 2021-07-21 16:21:32
 * @Description: 用户协议
 */
export default class CustAgreement extends Component {
  constructor(props) {
    super(props);
    this.state = {
      title: '',
      content: '',
      noTip: '暂无内容',
    };
  }

  componentDidMount() {
    const { navigation } = this.props;
    const state = navigation.state || {};
    const params = state.params || {};
    const { title, content } = params;
    this.setState({ title, content });
  }

  render() {
    const { title, content, noTip } = this.state;
    return (
      <SafeAreaView style={{ flex: 1 }}>
        <XMHeader
          title={title || ''}
          renderLeft={() => {
            return <BackImageOn />;
          }}
        />
        {content ? (
          <ScrollView
            showsHorizontalScrollIndicator={false}
            showsVerticalScrollIndicator={false}
          >
            <XmWebview
              style={{ width: '94%', marginLeft: '3%', marginTop: px2dp(10) }}
              enableBaseUrl
              source={{
                html: _.customStyle + content,
              }}
              scrollEnabled={false}
              showsVerticalScrollIndicator={false}
              showsHorizontalScrollIndicator={false}
            />
          </ScrollView>
        ) : (
          <View style={styles.noText}>
            <Text style={styles.TextSize}>{noTip}</Text>
          </View>
        )}
      </SafeAreaView>
    );
  }

  _handleBack = () => {
    msg.emit('router: back');
  };
}
const styles = StyleSheet.create({
  backImg: {
    width: 20,
    height: 20,
    marginLeft: 12,
  },
  noText: {
    width: screenWidth,
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  TextSize: {
    fontSize: px2dp(36),
  },
});
